<template>
	<view class="container edit-address">
		<view class="cell row b-b">
			<text class="tit">收货人</text>
			<input class="input" type="text" maxlength="10" v-model="info.pickupName" placeholder="请填写收货人姓名" placeholder-class="placeholder" />
		</view>
		<view class="cell row b-b">
			<text class="tit">手机号码</text>
			<input class="input" type="number" maxlength="11" v-model="info.pickupMobile" placeholder="请填写手机号码"
			 placeholder-class="placeholder" />
		</view>
		<view class="cell row b-b">
			<text class="tit">所在地区</text>
			<template v-if="regionDataFlag">
				<address-select class="input" :defaultValue="defaultValue" @change="onChangeRegion">
				</address-select>
				<i class="iconfont iconxiangyou" style="color:#ccc;"></i>
			</template>
		</view>
		<view class="cell row b-b">
			<text class="tit">详细地址</text>
			<input class="input" type="text" maxlength="100" v-model="info.addressDet" placeholder="例：6号楼301室" placeholder-class="placeholder" />
		</view>
		<!-- <view class="cell row b-b">
			<text class="tit fill">设为默认地址</text>
			<switch :checked="info.isDefault" color="#FF536F" @change="onSwitchChange" />
		</view> -->

		<mix-button ref="confirmBtn" text="确定" marginTop="60rpx" @onConfirm="submit"></mix-button>
		<loading v-if="isLoading"></loading>
		<tui-modal></tui-modal>
	</view>
</template>

<script>
	import addressSelect from '@/packageA/components/address-select/address-select'
	import mixButton from '@/components/mix-button/mix-button.vue'
	export default {
		components: {
			mixButton,
			addressSelect
		},
		data() {
			return {
				isLoading: false,
				info: {
					pickupName: '',
					pickupMobile: '',
					province: '',
					areaLevel1code: '',
					areaLevel2code: '',
					areaLevel3code: '',
					city: '',
					district: '',
					addressDet: '',
					isDefault: '',
					version: '',
				},

				defaultValue: null, // 默认值
				type: '', //编辑还是新增
				submitOrderFlag: 0, //确定后去购买还是回列表
				regionDataFlag:false,
			}
		},
		onLoad(options) {
			// #ifdef H5
			   this.$wechat.noShare();
			// #endif
		
			if (options.id) {
				uni.setNavigationBarTitle({
				　　title:'编辑收货地址'
				})
				this.type = 'update';
				let id = options.id;
				this.isLoading = true;
				this.$http.getEditAddress(id).then((res) => {
					this.isLoading = false;
					if (res.status === 0) {
						if (res.data) {
							this.defaultValue=[]
							this.info = res.data;
							this.defaultValue[0] = this.info.province;
							this.defaultValue[1] = this.info.city;
							this.defaultValue[2] = this.info.district;
							
							console.log(this.defaultValue);
							
						}
					}
				})

			} else {
				this.defaultValue=[]
				this.type = 'add';
				uni.setNavigationBarTitle({
				　　title:'新建收货地址'
				})
			}
			if (options.submitOrderFlag == 1) {
				this.submitOrderFlag = options.submitOrderFlag
			}
			if(this.$store.state.regionData.length==0){
				this.getRegionData()
			}else{
				this.regionDataFlag=true;
			}
		},
		methods: {
			getRegionData() {
				this.$http.readJsonFile().then((res) => {
					if (res.status === 0) {
						this.$store.commit("changeRegionData", res.data);
						this.regionDataFlag=true;
					}
				})
			},
			onChangeRegion(region) {
				console.log('选择的省市区数据：', region);
				
				this.defaultValue=[region[0].name,region[1].name,region[2].name];
				this.info.province = region[0].name;
				this.info.city = region[1].name;
				this.info.district = region[2].name;
				this.info.areaLevel1code= region[0].id;
				this.info.areaLevel2code= region[1].id;
				this.info.areaLevel3code= region[2].id;
			},
			submit() {
				if (!this.info.pickupName) {
					this.$util.msg('请输入收货人姓名');
					this.$refs.confirmBtn.stop();
					return;
				}
				if (!this.$util.checkStr(this.info.pickupMobile, 'mobile')) {
					this.$util.msg('请输入正确的手机号码');
					this.$refs.confirmBtn.stop();
					return;
				}
				if (this.defaultValue.length == 0) {
					this.$util.msg('请选择收货地址');
					this.$refs.confirmBtn.stop();
					return;
				}
				if (!this.info.addressDet) {
					this.$util.msg('请输入详细地址');
					this.$refs.confirmBtn.stop();
					return;
				}
				let params = {
					customerAddressId: this.info.customerAddressId,
					pickupName: this.info.pickupName,
					pickupMobile: this.info.pickupMobile,
					province: this.info.province,
					city: this.info.city,
					district: this.info.district,
					addressDet: this.info.addressDet,
					areaLevel1code:this.info.areaLevel1code,
					areaLevel2code:this.info.areaLevel2code,
					areaLevel3code:this.info.areaLevel3code,
				};
				if (this.type === 'update') {
					params.ifEdit = "edit";
					params.isDefault = this.info.isDefault;
					params.version = this.info.version;
					this.isLoading = true;
					this.$http.updateAddress(params).then((res) => {
						this.isLoading = false;
						if (res.status === 0) {
							uni.showToast({
								title: "地址修改成功!",
								icon: "none",
								duration: 500
							});
							this.$util.prePage().getAddress();
							setTimeout(() => {
								uni.navigateBack();
							}, 500)
						}
					})
				} else {
					this.isLoading = true;
					this.$http.addAddress(params).then((res) => {
						this.isLoading = false;
						if (res.status === 0) {
							uni.showToast({
								title: "地址新增成功!",
								icon: "none",
								duration: 500
							});
							if (this.submitOrderFlag == 1) {
								// this.$util.prePage().getAddress();
								setTimeout(() => {
									uni.navigateBack();
									// uni.navigateTo({
									// 	url: '../submitOrder/submitOrder'
									// });
									this.$util.prePage().getUserAddress();
								}, 500)
								// uni.redirectTo({
								// 	url:'../submitOrder/submitOrder'
								// })
							} else {
								this.$util.prePage().getAddress();
								setTimeout(() => {
									uni.navigateBack();
								}, 500)
							}

						}
					})
				}
			},

			// onSwitchChange(e) {
			// 	this.data.is_default = e.detail.value;
			// }
		}
	}
</script>

<style lang="scss">
	.edit-address {
		min-height: 100vh;
		padding: 10rpx 44rpx 0;
		background-color: #fff;
		.cell {
			height: 106rpx;
			border-bottom: 2rpx solid $borderColor;
		
			.tit {
				min-width: 140rpx;
				font-size: 28rpx;
				color: #111111;
			}
		
			.input {
				flex: 1;
				font-size: 30rpx;
				color: #333;
			}
		
			.icon-you {
				flex-shrink: 0;
				margin-right: 8rpx;
				margin-left: 40rpx;
				font-size: 24rpx;
				color: #aaa;
			}
		
			switch {
				transform: scale(0.8) translateX(10rpx);
				transform-origin: center right;
			}
		}
	}

	
</style>
